import '@babel/polyfill';

import printMe from './print.js';
import sayHi from './hello.js';

import imgPath from './images/w.jpg';
import doc from './doc.txt';

//import _ from 'lodash';
import './style.css';

console.log(process.env.DB_HOST);

function component() {
  return import(/* webpackChunkName: "lodash" */ 'lodash').then(
    ({ default: _ }) => {
      const element = document.createElement('div');
      element.innerHTML = _.join(['Hello ', 'webpack 5'], ' ');
      const btn = document.createElement('button');
      element.classList.add('hello');

      btn.innerHTML = 'Click me and check the console!' + 1;
      btn.onclick = () => {
        console.log(doc);
        printMe();
        sayHi();
      };

      let img = document.createElement('img');
      img.src = imgPath;
      element.appendChild(img);

      element.appendChild(btn);
      return element;
    }
  );
}

// document.body.appendChild(component());
component().then((ele) => {
  document.body.appendChild(ele);
});
